<!-- 新增编辑查看进场函 -->
<template>
        <div class="contractend">

                <el-breadcrumb separator="/" class="bread-title">
                        <el-breadcrumb-item :to="{ path: '/contractend' }">合同终止</el-breadcrumb-item>
                        <el-breadcrumb-item>{{{look:'查看',edit:'编辑'}[type]}}</el-breadcrumb-item>
                </el-breadcrumb>
                <h4>合同信息</h4>
                <el-form ref="ruleForm"  :inline="true" :model="params" class="demo-form-inline" label-width="120px" :rules="rules">
                        <div>
                                <el-form-item label="合同名称："  prop="contractName">
                                       <el-input v-model="params.contractName" disabled style="width:217px;" placeholder="请选择"></el-input>
                                       <el-button type="primary" style="margin-left:-3.5px;" @click="openChoseEnter" :disabled="type == 'look' || type == 'edit'">选择</el-button>
                                </el-form-item>
                                <el-form-item label="合同编号：" prop="contractCode">
                                        <el-input v-model="params.contractCode" placeholder="请输入" style="width:217px;" disabled></el-input>
                                </el-form-item>
                        </div>
                        <div>
                                <el-form-item label="收支类别："  prop="budgetType">
                                        <el-select v-model="params.budgetType" disabled>
                                                <el-option v-for="item in budgetTypes" :key="item.value" :label="item.label" :value="item.value" ></el-option>
                                        </el-select>
                                </el-form-item>
                                <el-form-item label="合同类型：" prop="contractType">
                                        <el-select v-model="params.contractType" disabled>
                                                <el-option v-for="item in contractTypes" :key="item.code" :label="item.name" :value="item.code" ></el-option>
                                        </el-select>
                                </el-form-item>
                        </div>
                        <div>
                                <el-form-item label="合同性质：" prop="contractNature">
                                        <el-select v-model="params.contractNature" disabled>
                                                <el-option v-for="item in contractNatrues" :key="item.value" :label="item.label" :value="item.value" ></el-option>
                                        </el-select>
                                </el-form-item>
                                <el-form-item label="经办人姓名："  prop="contractOperatorName">
                                        <el-input v-model="params.contractOperatorName" placeholder="请输入" style="width:217px;"  disabled></el-input>
                                </el-form-item>
                        </div>
                         <h4>终止主体信息</h4>
                         <div>
                                 <el-form-item label="终止主体类型：" prop="subjectType">
                                         <el-select v-model="params.subjectType" @change="choseType" :disabled="type == 'look' ">
                                                 <el-option v-for="item in subjectTypes" :key="item.partiesType" :label="item.partiesTypeName" :value="item.partiesType"></el-option>
                                         </el-select>
                                 </el-form-item>
                                 <el-form-item label="终止主体填写：" prop="subjectName">
                                         <el-input v-model="params.subjectName" placeholder="请输入" style="width:217px;" disabled></el-input>
                                 </el-form-item>
                         </div>
                         <div class="especially">
                                 <el-form-item label="合同终止原因：" prop="reason">
                                         <el-input type="textarea" :rows="3" v-model.trim="params.reason" placeholder="请输入合同终止原因" maxlength="100" :disabled="type == 'look' "></el-input>
                                 </el-form-item>
                         </div>
                         <div class="especially">
                                 <el-form-item label="备注">
                                         <el-input type="textarea" :rows="3" v-model.trim="params.remarks" placeholder="请输入备注" maxlength="100" :disabled="type == 'look' "></el-input>
                                 </el-form-item>
                         </div>
                         <div style="margin-left:260px;" v-if="type != 'look' ">
                                 <el-button type="primary" @click="faqishenpi">发起审批</el-button>
                                 <el-button type="primary" @click="save">保存</el-button>
                                 <el-button type="primary" @click="cancel">取消</el-button>
                         </div>
                         <div v-if="type== 'look' ">
                                 <h4>审核记录</h4>
                                 <el-table :data="operateData" border stripe style="margin:20px 0;width:80%;">
                                         <el-table-column label="操作" prop="actionName" align="center" :formatter="initActionName"></el-table-column>
                                         <el-table-column label="操作人" prop="participantName" align="center" ></el-table-column>
                                         <el-table-column label="角色" prop="displayName" align="center" ></el-table-column>
                                         <el-table-column label="时间" prop="receiveTime" align="center" ></el-table-column>
                                         <el-table-column label="审批意见" prop="itemComment" align="center"></el-table-column>
                                 </el-table>
                         </div>
                </el-form>
                <el-dialog title="请选择终止合同" :visible.sync="choseEnterVisible" width="70%" >
                        公司名称/姓名：<el-input v-model="choseEnterParams.contractName" placeholder="请输入" style="width:217px;"></el-input>
                        合同编号：<el-input v-model="choseEnterParams.contractCodeCope" placeholder="请输入" style="width:217px;"></el-input>
                        <el-button type="primary" @click="queryEnter">查询</el-button>
                        <el-table :data="choseEnterData" border stripe style="margin:20px 0;" @row-click="getEnterItem">
                                <el-table-column label="序号" type="index" align="center" width="55"></el-table-column>
                                <el-table-column label=""  align="center" width="55">
                                        <template slot-scope="scope">
                                                <el-radio class="radio"  v-model="choseEnterRadio"  :label="scope.$index">&nbsp;</el-radio>
                                        </template>
                                </el-table-column>
                                <el-table-column label="合同名称" prop="contractName" align="center" ></el-table-column>
                                <el-table-column label="合同编号" prop="contractCode" align="center" ></el-table-column>
                                <el-table-column label="合同状态" prop="status" align="center" :formatter="initcontractStatus"></el-table-column>
                                <el-table-column label="收支类别" prop="budgetType" align="center" :formatter="initbudgetcategory"></el-table-column>
                                <el-table-column label="合同类型" prop="contractType" align="center" :formatter="initcontractcategory"></el-table-column>
                                <el-table-column label="合同性质" prop="contractNature" align="center" :formatter="initcontractnature"></el-table-column>
                                <el-table-column label="付款方" prop="payment" align="center" ></el-table-column>
                                <el-table-column label="收款方" prop="receivables" align="center" ></el-table-column>
                                <el-table-column label="经办人" prop="contractOperatorName" align="center" ></el-table-column>
                        </el-table>
                        <el-pagination
                                    @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange"
                                    :current-page="choseEnterParams.pageNum"
                                    :page-sizes="[10, 20, 40, 50]"
                                    :page-size="choseEnterParams.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper"
                                    :total="contractEnterTotal" style="margin-top:30px;">
                         </el-pagination>
                        <div class="btns" style="margin-top:15px;">
                                <el-button type="primary" @click="closeChoseEnter">关闭</el-button>
                                <el-button type="primary" @click="assignmentEnter">确定</el-button>
                        </div>
                </el-dialog>
        </div>
</template>

<script>
import api from '@/api/apiPath'
export default {
        data(){
                return {
                        id:this.$route.query.endId,
                        type:this.$route.query.type,
                        budgetTypes:[
                                {label:"全部",value:""},{label:"收款类",value:0},{label:"支出类",value:1}
                        ],
                        contractTypes:[
                                {label:"全部",value:""},{label:"开发商类",value:100001},{label:"渠道商类",value:100002}
                        ],
                        contractNatrues:[
                                {label:"全部",value:""},{label:"框架合同",value:0},{label:"主合同",value:1},{label:"分合同",value:2}
                        ],
                        subjectTypes:[],//改为接口获取 loadTypeBody
                        choseEnterVisible:false,
                        choseBroker:"",
                        choseEnterData:[],
                        choseEnterRadio:"",
                        contractEnterTotal:0,
                        operateData:[],
                        payment:"",//付款方
                        receivables:"",//收款方
                        choseEnterParams:{
                                pageNum:1,
                                pageSize:10,
                                contractName:"",
                                contractCodeCope:"",
                                cityId:JSON.parse(sessionStorage.getItem("cmsUser")).cityId,
                                userId:JSON.parse(sessionStorage.getItem("cmsUser")).userId
                        },
                        choseEnterSelected:{},
                        params:{
                                contractName:"",//合同名称
                                contractCode:"",//合同编号
                                budgetType:"",//收支类别
                                contractType:"",//合同类型
                                contractNature:"",//合同性质
                                contractOperatorName:"",//经办人姓名
                                subjectType:'',//终止主体类型
                                subjectName:"",//终止主体名称
                                reason:"",//合同终止原因
                                remarks:"",//备注
                                createTime:"",
                                updateTime:"",
                                createUserid:JSON.parse(sessionStorage.getItem("cmsUser")).userId,
                                createUserName:JSON.parse(sessionStorage.getItem("cmsUser")).name
                        },
                        rules:{
                                contractName:[{required: true, message: '请选择', trigger: 'blur'}],
                                contractCode:[{required: true, message: '请输入', trigger: 'blur'}],
                                budgetType:[{required: true, message: '请选择', trigger: 'change'}],
                                contractType:[{required: true, message: '请选择', trigger: 'change'}],
                                contractNature:[{required: true, message: '请选择', trigger: 'change'}],
                                contractOperatorName:[{required: true, message: '请输入', trigger: 'blur'}],
                                subjectType:[{required: true, message: '请选择', trigger: 'change'}],
                                subjectName:[{required: true, message: '请输入', trigger: 'blur'}],
                                reason:[{required: true, message: '请输入', trigger: 'blur'}]
                        }
                }

        },
        methods:{
                initActionName(row, column, cellValue, index){
                    if(cellValue=="Submit"){
                        return "审核通过"
                    }else if(cellValue=="Reject"){
                        return "审核拒绝"
                    }else{
                        return "发起审批"
                    }
                },
                loadType(){//合同类型初始化列表
                        this.axios.post(api.CONTRACTENDTYPE,{}).then((res)=>{
                                if(res.data.code==200){
                                        this.contractTypes=res.data.data;
                                }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },
                initData(){
                        let id=Number(this.id)
                        //预先赋值 请求完毕之后替换
                        this.subjectTypes = [{partiesTypeName:"付款方",partiesType:1},{partiesTypeName:"收款方",partiesType:2},{partiesTypeName:"丙方",partiesType:3}];
                        this.axios.post(api.SEARCHCONTRACTEND,{id:id}).then((res)=>{
                                if(res.data.code==200){
                                       let result=res.data.data.contract;
                                       this.operateData=res.data.data.logList;
                                        this.params.contractCode=result.contractCode;
                                       this.params.contractName=result.contractInfo.contractName;
                                       this.params.contractType=result.contractInfo.contractType;
                                       this.params.contractNature=result.contractInfo.contractNature;
                                       this.params.contractOperatorName=result.contractInfo.contractOperatorName;
                                       this.params.budgetType=result.contractInfo.budgetType;
                                       this.params.subjectName=result.subjectName;
                                       //this.params.subjectType=result.subjectType;
                                       this.params.reason=result.reason;
                                       this.params.remarks=result.remarks;
                                        //编辑状态下请求终止主体
                                       this.loadTypeBody(result.contractInfo.id,result.subjectType)

                                }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },
                loadTypeBody(id,subjectType){
                        this.axios.post(api.GETSUBJECTTYPE,{id:id}).then((res)=>{
                                if(res.data.code==200){
                                      this.subjectTypes = res.data.data;
                                      //编辑状态下赋值主体状态
                                      if(subjectType+1){//判断subjectType有值
                                              this.params.subjectType = subjectType;
                                        }
                                }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },
                loadData(){
                        this.axios.post(api.CHOSECONTRACTENDLIST,this.choseEnterParams).then((res)=>{
                                if(res.data.code==200){
                                        this.choseEnterData=res.data.data.list;
                                        this.contractEnterTotal=res.data.data.total;
                                }
                        }).catch((error)=>{
                                console.log(error)
                        })
                },
                openChoseEnter(){
                        this.choseEnterVisible=true
                },
                getEnterItem(row){
                        this.choseEnterRadio=this.choseEnterData.indexOf(row);
                        this.choseEnterSelected=row;
                },
                queryEnter(){
                        this.choseEnterParams.pageNum = 1;
                        this.choseEnterParams.pageSize = 10;
                        this.loadData();
                },
                handleSizeChange(val){
                        this.choseEnterParams.pageSize = val;
                        this.loadData();
                },
                handleCurrentChange(val){
                        this.choseEnterParams.pageNum = val;
                        this.loadData();
                },
                closeChoseEnter(){
                        this.choseEnterVisible=false
                },
                assignmentEnter(){
                        this.params.contractName=this.choseEnterSelected.contractName;
                        this.params.contractCode=this.choseEnterSelected.contractCode;
                        this.params.budgetType=this.choseEnterSelected.budgetType;
                        this.params.contractType=this.choseEnterSelected.contractType;
                        this.params.contractNature=this.choseEnterSelected.contractNature;
                        this.params.contractOperatorName=this.choseEnterSelected.contractOperatorName;
                        this.payment=this.choseEnterSelected.payment;
                        this.receivables=this.choseEnterSelected.receivables;
                        this.params.subjectName=this.choseEnterSelected.payment;
                        //this.params.subjectType=1;
                        this.choseEnterVisible=false
                        this.loadTypeBody(this.choseEnterSelected.id);
                },
                initcontractStatus(row, column, cellValue, index){
                        if(cellValue==0){return "未审批"}
                        if(cellValue==1){return "审批中"}
                        if(cellValue==2){return "会签中"}
                        if(cellValue==3){return "会签通过"}
                        if(cellValue==4){return "会签不通过"}
                        if(cellValue==5){return "终止中"}
                        if(cellValue==6){return "已终止"}
                        if(cellValue==7){return "变更中"}
                        if(cellValue==8){return "已变更"}
                        if(cellValue==9){return "已作废"}
                        if(cellValue==10){return "已发布"}
                        if(cellValue==11){return "已删除"}
                },
                initbudgetcategory(row, column, cellValue, index){
                        if(cellValue==0){return "收入类"}
                        if(cellValue==1){return "支出类"}
                },
                initcontractcategory(row, column, cellValue, index){
                        if(cellValue==100001){return "开发商类"}
                        if(cellValue==100002){return "渠道商类"}
                },
                initcontractnature(row, column, cellValue, index){
                        if(cellValue==0){return "框架合同"}
                        if(cellValue==1){return "主合同"}
                        if(cellValue==2){return "分合同"}
                },
                choseType(val){//选择收付款方
                        // if(val==1){
                        //         this.params.subjectName=this.payment;
                        // }else if(val==2){
                        //         this.params.subjectName=this.receivables;
                        // }else{
                        //         this.params.subjectName=""
                        // }
                         let thisObj = this.subjectTypes.find(item=>{
                                                return val === item.partiesType;
                                        })
                        this.params.subjectName= thisObj.companyName||'';
                },
                save(){
                        this.$refs["ruleForm"].validate((valid)=>{
                                if(!valid){
                                        return;
                                }
                                if(this.type=="edit"){
                                        this.params.updateUserid=JSON.parse(sessionStorage.getItem("cmsUser")).userId;
                                        this.params.updateUserName=JSON.parse(sessionStorage.getItem("cmsUser")).name;
                                        this.params.id=this.id;
                                        this.axios.post(api.EDITCONTRACTEND,this.params).then((res)=>{
                                                if(res.data.code==200){
                                                        this.$alert("操作成功", '提示', {
                                                                type: 'success ',
                                                                confirmButtonText: '确定',
                                                                callback: action => {
                                                                        this.$router.push({
                                                                                path:"/contractend"
                                                                        })
                                                                }
                                                        });
                                                }
                                        }).catch((error)=>{
                                                console.log(error)
                                        })
                                }else{
                                        this.axios.post(api.ADDCONTRACTENDLIST,this.params).then((res)=>{
                                                console.log(res);
                                                if(res.data.code==200){
                                                        this.$alert("操作成功", '提示', {
                                                                type: 'success ',
                                                                confirmButtonText: '确定',
                                                                callback: action => {
                                                                        this.$router.push({
                                                                                path:"/contractend"
                                                                        })
                                                                }
                                                        });
                                                }
                                        }).catch((error)=>{
                                                console.log(error)
                                        })
                                }
                        })
                },
                faqishenpi(){
                    this.params.isfaqi=1;
                    this.save();
                },
                cancel(){
                        this.$router.push({
                                path:"/contractend"
                        })
                }
        },
        mounted(){
                this.loadType();
                if(this.type !="look"){
                        this.loadData();
                }
                if(this.type=="look" || this.type=="edit"){
                        this.initData();
                }
        },
        components:{

        }
}
</script>

<style lang="stylus" scoped>
       .contractend{
               .el-form{
                       .el-form-item{
                               width:35%;
                       }
                       &>div{
                               margin-left: 100px;
                       }
                       & .especially{
                               & .el-form-item{
                                       width:80% !important;
                                       .el-textarea{
                                               width: 800px;
                                       }
                               }
                       }
               }
               .commonclass:before{
                       content: '*';
                       color: #f56c6c;
                       margin-right: 2px;
               }
               .el-table .cell{
                       white-space:nowrap !important;
               }
       }
</style>
